const $mode = document.getElementById('mode');
const $custom = document.getElementById('custom');
const $start = document.getElementById('start');
const $row = document.getElementById('row');
const $col = document.getElementById('col');
const $mine = document.getElementById('mine');
let mode = 1;
const modeOpts = [
    [],
    [10, 10, 10],
    [12, 12, 30],
    [15, 15, 50],
];

$mode.onchange = function() {
    mode = Number(this.value);
    $custom.style.display = mode ? 'none' : 'inline-block';
};

function start() {
    document.getElementById('app').innerHTML = '';
    if (mode) {
        new Minesweeper('#app', ...modeOpts[mode]);
    } else {
        new Minesweeper('#app', +$row.value, +$col.value, +$mine.value)
    }
}

$start.onclick = start;

start();


